<template>
  <div class="home">
    <div id="shortcut">
      <navBar class="w"></navBar>
    </div>
    <div id="header">
      <search class="w"></search>
    </div>
    <div id="main">
      <sort
        class="left"
        :nav_lists="navData.navLists"
        :nav_items="navData.navItems"
      ></sort>
      <div class="carousel">
        <el-carousel height="480px" arrow="always" :loop="true">
          <el-carousel-item v-for="(item, index) in imgs" :key="index">
            <a :href="item.path">
              <img :src="item.imgPath" alt="无网络" />
            </a>
          </el-carousel-item>
        </el-carousel>
      </div>
      <div class="poster">
        <el-carousel
          height="480px"
          :autoplay="false"
          indicator-position="none"
          :loop="true"
        >
          <el-carousel-item
            class="posterList"
            v-for="(item, index) in newRem"
            :key="index"
          >
            <imgList :list="item" :height="156"></imgList>
          </el-carousel-item>
        </el-carousel>
      </div>
      <div class="right">
        <div class="user">
          <div class="user_top">
            <a href="https://home.jd.com/" class="avatar">
              <img
                src=""
                alt="头像"
              />
            </a>
            <div class="user_text">
              <p>Hi~欢迎逛京东</p>
              <p><a href="">登录</a><span>|</span><a href="">注册</a></p>
            </div>
          </div>
          <div class="user_bom">
            <a href="https://xinren.jd.com/?channel=99"> 新人福利 </a>
            <a
              href="https://plus.jd.com/index?flow_system=appicon&flow_entrance=appicon3&flow_channel=pc"
            >
              PLUS会员
            </a>
          </div>
        </div>
        <div class="news">
          <div class="news_hd">
            <span class="hd1">京东快报</span>
            <span class="hd2">更多></span>
          </div>
          <newslist class="news_list" :newslists="newsLists"></newslist>
        </div>
        <div class="service">
          <ul>
            <li
              class="serveItem"
              v-for="(item, index) in helpLists"
              :key="index"
            >
              <a :href="item.path" class="serveItem">
                <i
                  :class="'iconfont ' + item.imgName"
                  :style="{ color: item.color }"
                ></i>
                <span>{{ item.name }}</span>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <div class="seckill w">
      <div class="time">
        <header>京东秒杀</header>
        <div class="countdown">
          <p><strong>16:00</strong>点场 距结束</p>
          <div class="down">
            <span v-for="(item, index) in time" :key="index">{{ item }}</span>
          </div>
        </div>
      </div>
      <div class="items">
        <el-carousel
          arrow="always"
          height="260px"
          :autoplay="false"
          indicator-position="none"
          :loop="true"
        >
          <el-carousel-item v-for="(item, index) in newSlider" :key="index">
            <a
              class="itemsA"
              v-for="(item1, index1) in item"
              :key="index1"
              :href="item1.path"
            >
              <img :src="item1.imgPath" alt="无网络" />
              <span class="itemsTitle">{{ item1.text }}</span>
              <div class="price">
                <span>{{ item1.newPrice }}</span
                ><span>{{ item1.oldPrice }}</span>
              </div>
            </a>
          </el-carousel-item>
        </el-carousel>
      </div>
      <div class="band">
        <a
          class="container"
          href="https://miaosha.jd.com/brandlist.html?brand_id=50478&sku_id=100014142126"
        >
          <img
            src="https://img12.360buyimg.com/seckillcms/s260x260_jfs/t1/178045/24/15530/146276/60f919a6E21c948d7/42faf0399bbaa172.jpg.webp"
            alt="品类秒杀"
          />
          <span>厨卫电器抢先购</span>
          <span>爆款直降赠壕礼</span>
          <div class="btn">品类秒杀 ></div>
        </a>
      </div>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import navBar from "@/components/navBar.vue";
import search from "@/components/search.vue";
import imgList from "@/components/imgList.vue";
import sort from "@/views/home/components/sort.vue";
import newslist from "@/views/home/components/newslist.vue";

export default {
  name: "Home",
  components: {
    navBar,
    search,
    imgList,
    sort,
    newslist,
  },
  data() {
    return {
      navData: {
        navLists: [
          [
            {
              name: "家用电器",
              path: "https://jiadian.jd.com/",
            },
          ],
          [
            {
              name: "手机",
              path: "",
            },
            {
              name: "运营商",
              path: "",
            },
            {
              name: "数码",
              path: "",
            },
          ],
          [
            {
              name: "电脑",
              path: "",
            },
            {
              name: "办公",
              path: "",
            },
          ],
          [
            {
              name: "男装",
              path: "",
            },
            {
              name: "女装",
              path: "",
            },
            {
              name: "童装",
              path: "",
            },
            {
              name: "内衣",
              path: "",
            },
          ],
          [
            {
              name: "美妆",
              path: "",
            },
            {
              name: "个护清洁",
              path: "",
            },
            {
              name: "宠物",
              path: "",
            },
          ],
          [
            {
              name: "女鞋",
              path: "",
            },
            {
              name: "箱包",
              path: "",
            },
            {
              name: "钟表",
              path: "",
            },
            {
              name: "珠宝",
              path: "",
            },
          ],
          [
            {
              name: "男鞋",
              path: "",
            },
            {
              name: "运动",
              path: "",
            },
            {
              name: "户外",
              path: "",
            },
          ],
          [
            {
              name: "房产",
              path: "",
            },
            {
              name: "汽车",
              path: "",
            },
            {
              name: "汽车用品",
              path: "",
            },
          ],
          [
            {
              name: "母婴",
              path: "",
            },
            {
              name: "玩具乐器",
              path: "",
            },
          ],
          [
            {
              name: "食品",
              path: "",
            },
            {
              name: "酒类",
              path: "",
            },
            {
              name: "生鲜",
              path: "",
            },
            {
              name: "特产",
              path: "",
            },
          ],
          [
            {
              name: "艺术",
              path: "",
            },
            {
              name: "礼品鲜花",
              path: "",
            },
            {
              name: "农资绿植",
              path: "",
            },
          ],
          [
            {
              name: "医药保健",
              path: "",
            },
            {
              name: "计生情趣",
              path: "",
            },
          ],
          [
            {
              name: "图书",
              path: "",
            },
            {
              name: "文娱",
              path: "",
            },
            {
              name: "教育",
              path: "",
            },
            {
              name: "电子书",
              path: "",
            },
          ],
          [
            {
              name: "机票",
              path: "",
            },
            {
              name: "酒店",
              path: "",
            },
            {
              name: "旅游",
              path: "",
            },
            {
              name: "生活",
              path: "",
            },
          ],
        ],
        navItems: [
          {
            channel: [
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
            ],
            detail: {
              tit: [
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
              ],
              con: [
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },

                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
              ],
            },
            brand: [
              {
                imgPath:
                  "https://img14.360buyimg.com/vclist/s166x70_jfs/t1/90641/24/3606/1171/5de0e340Eaad1e3e0/5b9cad64436c05ff.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://img14.360buyimg.com/vclist/s166x70_jfs/t1/90641/24/3606/1171/5de0e340Eaad1e3e0/5b9cad64436c05ff.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://img14.360buyimg.com/vclist/s166x70_jfs/t1/90641/24/3606/1171/5de0e340Eaad1e3e0/5b9cad64436c05ff.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://img14.360buyimg.com/vclist/s166x70_jfs/t1/90641/24/3606/1171/5de0e340Eaad1e3e0/5b9cad64436c05ff.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://img14.360buyimg.com/vclist/s166x70_jfs/t1/90641/24/3606/1171/5de0e340Eaad1e3e0/5b9cad64436c05ff.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://img14.360buyimg.com/vclist/s166x70_jfs/t1/90641/24/3606/1171/5de0e340Eaad1e3e0/5b9cad64436c05ff.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
            ],
            promotion: [
              {
                imgPath:
                  "https://img30.360buyimg.com/vclist/s336x268_jfs/t1/167445/2/18404/14448/607794b4E85c4f675/803d17c4e1970023.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://img30.360buyimg.com/vclist/s336x268_jfs/t1/167445/2/18404/14448/607794b4E85c4f675/803d17c4e1970023.jpg.webp",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
            ],
          },
          {
            channel: [
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
              {
                name: "家电馆 >",
                path: "https://jiadian.jd.com/",
              },
            ],
            detail: {
              tit: [
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
                {
                  name: "电视 >",
                  path: "https://list.jd.com/list.html?cat=737,794,798",
                },
              ],
              con: [
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
                [
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                  {
                    name: "智慧屏",
                    path: "https://list.jd.com/list.html?cat=737,794,798&ev=4155_122030",
                  },
                ],
              ],
            },
            brand: [
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
            ],
            promotion: [
              {
                imgPath:
                  "https://misc.360buyimg.com/mtd/pc/common/img/blank.png",
                path: "https://mall.jd.com/index-1000000950.html?from=pc",
              },
            ],
          },
        ],
      },
      imgs: [
        {
          imgPath:
            "https://img13.360buyimg.com/pop/s1180x940_jfs/t1/191473/22/13064/97981/60efcd7fEde609b1a/8640695d031c2e4f.jpg.webp",
          path: "https://ccc-x.jd.com/dsp/nc?ext=aHR0cHM6Ly9wcm8uamQuY29tL21hbGwvYWN0aXZlLzZKc0gzR3FDbWNVTlEyM2VHWHpEZlZTTDVrTS9pbmRleC5odG1s&log=CrsmMfIch_iILh2jpjW4CtdIUk5rFfWJcgDw4B_g9Zz66YzS0LkcqW-kYt4KAC_guUhIPk7xIwItFQaAQI8knSU3GWU4XGXjWwHd2lHIvJTPwtIvtjb-XKEJ3HSnaT0CVMhFXarT_abnKw7tfPUAw3-KzrbRdcZlOWPSYKTg5Y3YIZKIGcnZF0Og-7heJ-kzDt_j-IBBrkfnBZn2iZOfdgAmoy-FDSA3yxkSYQHQvU8Vlssb2CafS8ABmkm4nXWOQPuSr063je4zea8dlTiCwrepUmaxJr_nu9fJN8IDfdScwIrKNxHTRf75dTX_REUUCT91tS9nU9vapTrFvKjc1Pf2HsJ7aGfXrY7Y4WwaEodgS_3AK8vx83DFO0i1mZt6kiQD9LsAcnXXvW9SbdUhAU180AtxaMOYX0aqmIL3lslcd0cIwftZlm-qcx-cUSJBjeqZ8TadOhXR29LGy7Q0M3K6pDDPqHziUIMT9hE4wTFSTnZ0Koe9teNJ4R4w9wbtESaUULaOVMUqDpemcrRiJB6bWeniR0aNv9WtbnE2EvAPHaOZ6UIKSauv3UnT3Pdm_7yHD0_mAwF69VyxVFvhsbbHH8xcy0JOtuYuJc_rKabaIAGOAiueppIi92ba24QHDsRx9aPzO6HSOwuwnufrGa9ZUwUUEDJnEB5DvezsVhZDc1EdfLgMeNhy-T7ISLVRY1KTNdUSxUv56gQfqkPLzn5yM3Sq0hYRrFQRBrXO1sVFpIMRsSmbV0VzknQy8uNYwi1tA_zlZ3TJqsgOq72p3ccwfA1aJgAX3Z3ruqPqs5yGHlDwDMVWPN3mZud2LOJurPV1hKFLI1LtNlLh2Yd1zuPUaZcVHzbRUhAwI5TCMSFfRELHMQE4RCgtOSqQxHy09xe73Bv3O7BTtUEb6wHUeKoQadac_enchAR-Ual45s0&v=404",
        },
        {
          imgPath:
            "	https://imgcps.jd.com/img-cubic/creative_server_cia/v2/2000366/100011510320/FocusFullshop/CkNqZnMvdDEvMTg3MDU2LzMxLzEyNDE2LzUzMjExLzYwZTY5M2Y5RWNjOTdiMDhkL2RiNTQ3YjU4YTlmNjVkNjAucG5nEgkzLXR5XzBfNTQwAjjui3pCEwoP5bq35a6d5raI5q-S5p-cEABCEAoM5ruhNTAw5YePMTAwEAFCEAoM56uL5Y2z5oqi6LStEAJCCgoG5LyY6LSoEAdYsJSayfQC/cr/s/q.jpg",
          path: "https://ccc-x.jd.com/dsp/nc?ext=aHR0cHM6Ly9jaGFubmVsLW0uamQuY29tL3BjL3BzcC8xMDAwMTE1MTAzMjA_aW11cD1DZ1lLQUJJQUdBQVNIQWl3bEpySjlBSVFqYkRyM0FNYUNHZGthMkprY1dkbUlKVUtLQUVZcnhzZ0FDb2xiV2w0ZEdGblgya3NkV1FzZUdkbUxHZHBZU3hqYVdFc1psOWlZVjltYkY5c05Ea3pPVElJYldsNGRHRm5YMms2TGdvSVkyRnVZbTh3TURFUW1yMGhHQU1ndW95QnFmakZvXzktS0lDaXF6Y3dfNkdyTnpnVFFJQ0FJR0FDYUFGS25BRkpmRTFKV0ZSQlIxOUpVaXhKWDBGZlJreGZURU1zU1Y5QlgxSkZYMHd4TWpNMk55eEpYMEZmVUV4ZlVpeEpYMEZmVTB4ZlRFTXNTVjlCWDBOVFgxSXNTVjlWWDBaTVgxSXNTVjlUWDBaTVgxSXNTVjlTWDBaTVgxSXNTVjlRWDBaTVgxSXNTVjlIWDFoSFgxSXNTVjlDWDBaTVgxSXNSMGxCTEZoSFJpeFZSSHc3Um54TlNWaFVRVWRmUmxJc1JsOUNRVjlHVEY5TU5Ea3pPWHc&log=VxX1YWgv0ZpQAsZ9ddRQPEYQG3RnVthQwzzS3RUr9Klk6VaZqmnZZpWdRx_LtrA9cHaKQJRLkYuNqyqpiPWh2OynDolxgOUfW_9_xWEYLGDHHQ6RnWCKuhEyb35S5z0Q-mLQDUFzzqd2Y_1aTGC3I5lYt8giToj4agNcC75fHgl0gPwNIeA2hOD4CX8PHZcV8Cnz2itrPw-D43fhAhk25iB4tz3y-WBAqcBziL1PRMoynHMTM4-hXn2KSdczOGwIQXpwc1dLS_067tV2mHvDvG-ajHtS_U1DXNxRnLy0sk5GRwTdIYhJgDvCg-z4YHYLh-k3fJvnVvC4iNwtMfCG08ltKa_oGC1n0JVFVTLYHAsSRewxBtTwDXmnCJyQp-2nM4KOXPpl_4r-PH-JWSuLQDmafbpGN2muq-Kq82se_p8dCIHvz9rOzf-B6TWIcmqmf8t2PZVnyzNMHWRKECvfOA9gGtsTqH24KChYZMw0132MNOWNseWvFKt5IqtIXORQ0EPbJsvf0vXigdm2ZsLeQKyVNtGAW80Nlcf2sF_1q-RVbAApmiIgbFxId3xyahYgiQKoiOfUKjvd28E4JVIwzYQUGdzjiynBDVyb2RtaDla-t2be_Ne-xzPWk4HA28mZeWZGucwSbvlQM7rZDkvKewDhg3Tzhe82h5uD9aEKaWc33Y6iiNcTzY-lBKqqhCjWzzQJTJspmr-r1OqdKKdVCXCPeSjjbYlpVlFzXkG6vIGJsHyUXFuMPY7B2o4FptJGFEdQkyttg_Hjgfvp5HNFOuJE1n_Yu081Nd6HaVwWcpwMb3sGILue2vyAXoWhTmukiEpcXpGCHNAzvg0YB4C6vV46k8k3i_LqIivVsFdyO6Ez51kJTpWgcNLmDDnWXaECqIRL3xeAuN-GNWP5H3Us6cyzOYSLeFFhKWNUByZZ5r5mt7oAVMp-nHSZTuNqfopMFiz5iEXFXMN0XjjVHa-EtUfzdBTqTQdffiegizZBDD-5hHeC6t-ZT5NI4zgTH-DMAgmPwD6bo6YfY0roUPip9A&v=404",
        },
        {
          imgPath:
            "https://imgcps.jd.com/img-cubic/creative_server_cia/v2/2000366/16989632739/FocusFullshop/CkRqZnMvdDEvMTg3MjgwLzM0LzEyMzMwLzQ2NjQ3Ni82MGU2YTgxMkU1NzZhZDVhNC82OTQ3ZWVhNjViYTZhMWFkLnBuZxIJMi10eV8wXzUzMAI47ot6QhAKDE9QUOS8kemXsumeixAAQhAKDOS8mOS6q-Wlvei0pxABQhAKDOeri-WNs-aKoui0rRACQgoKBuS8mOmAiRAHWOPxpKU_/cr/s/q.jpg",
          path: "",
        },
        {
          imgPath:
            "https://imgcps.jd.com/ling4/7796455/6Ziy6Zuo6Ziy5rGb5b-F5aSH/54iG5qy-5L2O6IezOS455YWD/p-5bd8253082acdd181d02fa33/735276e2/cr/s/q.jpg",
          path: "",
        },
        {
          imgPath:
            "https://imgcps.jd.com/img-cubic/creative_server_cia/v2/2000366/10022936881300/FocusFullshop/CkRqZnMvdDEvMTM5MzUwLzE0LzEzNzE1LzEwOTcwMy81ZmE1YzI0YUVlOGYyZTk0Mi8xODIyZjI0ZGQwMzBkZGM4LmpwZxIKOTk5LXR5XzBfMTABOO6LeliU0d6s2qMC/cr/s/q.jpg",
          path: "",
        },
      ],
      recommendLists: [
        {
          path: "https://pro.jd.com/mall/active/3ezT1QLsWmuu8MPCmWEVUg46GNBA/index.html?babelChannel=ttt10",
          imgPath:
            "https://img14.360buyimg.com/babel/s380x300_jfs/t1/168591/2/9328/64891/603ddb1aE93567699/3e4e717eeac051b2.jpg.webp",
        },
        {
          path: "https://prodev.jd.com/mall/active/7aM58YGuPHf1hk427yZjcqc4oBe/index.html",
          imgPath:
            "https://img11.360buyimg.com/babel/s380x300_jfs/t1/181595/29/5122/90113/60a611c2Edbe5dcf2/38aec127b8a2a488.jpg.webp",
        },
        {
          path: "https://ccc-x.jd.com/dsp/nc?ext=aHR0cHM6Ly9tYWxsLmpkLmNvbS9pbmRleC05NTY0NzIuaHRtbA&log=Ey0wAbettlbTDUJJax4T66ICnWcSbJAyaP4NfYTkhab6Y-OQ8ZA9rSUk0DBxggOk61HkswLi2C3U-WpUBCHS6eTVmEF3cLRYo3j786KkWSC-WzRK42EPysh8sVi7KFKaUytxU7W1QUf2Jh6KBt7EAyN-3-tqQV7hStpYe-tiEpybQ1fFfTMdL8QtkEHF54dc2hIcZ_4fRvbuviJMVhk2AKoq4Ni3Y9kVbtfVNBJxiUqj0aTUymE3JjMudsB2KjTjDjjw0PoF_tednA1AqzFNTVFVK66DUN5QIXvCSOzHhUr3xdFOhmQvkpx8mVdw71x9Osd4aayMvKTmow5VSdCa5rWvYhwpUfRwuf21ApmgB6By_m4U3WtKPvVhCrGXKuF7ya1tOMwy1JBdhf0EWwnxUrj-vOBptDrWgjyufZ0b8rHbA2u5BZOxZBK1JQi-3t-pAb_hbUj6ZNZQ9LSew3ZVJwDRVRJnY3xonoTNPeCz5gVE06PZAhTuYESlexM7dfy7uCjGDHHxym4EYCA77tLe0zG8BOr4v8RqFjSlPSazE6o82u4YMtC5qZ_EVtclX8ycqddlh-W1G4L0FdVwjwarDOWNnIKdFjXeakHsfVXgGD_u1DgcSnDPtCgBKTZhPyH-BVxAZJBK5TAEggbycF7cfQ5f6EqEwUsG0B6SqgXfoAbjK5JhDh2bksU7vIpwolF_rqtr2IxxYRmtpg8EQtOoYIxd1RwRWkWGpikOvgSk7DVXv6X3GZtJvpzGIrDKPexnJZoS1dTvSyE6DwVV3mOrPpcP9i3ZiyOXUFZgh3HP_J_b3js1P4VFeYI9SFCNPJzWRWLD1_oDcJD7KvAgHLlb2BismXa023_6ZiKZOa7qu1cvwHCEq4WS_UQnefhsXhxFQaotDQPm92nN9jBDjhIlRxom_c0t0OTrfo0TF2Gzhl4&v=404",
          imgPath:
            "https://img13.360buyimg.com/pop/s380x300_jfs/t1/182986/23/14504/65353/60f29bb7Efe095a2d/bc9c3c7e0f0fbc69.jpg.webp",
        },
        {
          path: "https://prodev.jd.com/mall/active/7aM58YGuPHf1hk427yZjcqc4oBe/index.html",
          imgPath:
            "https://img11.360buyimg.com/babel/s380x300_jfs/t1/181595/29/5122/90113/60a611c2Edbe5dcf2/38aec127b8a2a488.jpg.webp",
        },
        {
          path: "https://ccc-x.jd.com/dsp/nc?ext=aHR0cHM6Ly9tYWxsLmpkLmNvbS9pbmRleC05NTY0NzIuaHRtbA&log=Ey0wAbettlbTDUJJax4T66ICnWcSbJAyaP4NfYTkhab6Y-OQ8ZA9rSUk0DBxggOk61HkswLi2C3U-WpUBCHS6eTVmEF3cLRYo3j786KkWSC-WzRK42EPysh8sVi7KFKaUytxU7W1QUf2Jh6KBt7EAyN-3-tqQV7hStpYe-tiEpybQ1fFfTMdL8QtkEHF54dc2hIcZ_4fRvbuviJMVhk2AKoq4Ni3Y9kVbtfVNBJxiUqj0aTUymE3JjMudsB2KjTjDjjw0PoF_tednA1AqzFNTVFVK66DUN5QIXvCSOzHhUr3xdFOhmQvkpx8mVdw71x9Osd4aayMvKTmow5VSdCa5rWvYhwpUfRwuf21ApmgB6By_m4U3WtKPvVhCrGXKuF7ya1tOMwy1JBdhf0EWwnxUrj-vOBptDrWgjyufZ0b8rHbA2u5BZOxZBK1JQi-3t-pAb_hbUj6ZNZQ9LSew3ZVJwDRVRJnY3xonoTNPeCz5gVE06PZAhTuYESlexM7dfy7uCjGDHHxym4EYCA77tLe0zG8BOr4v8RqFjSlPSazE6o82u4YMtC5qZ_EVtclX8ycqddlh-W1G4L0FdVwjwarDOWNnIKdFjXeakHsfVXgGD_u1DgcSnDPtCgBKTZhPyH-BVxAZJBK5TAEggbycF7cfQ5f6EqEwUsG0B6SqgXfoAbjK5JhDh2bksU7vIpwolF_rqtr2IxxYRmtpg8EQtOoYIxd1RwRWkWGpikOvgSk7DVXv6X3GZtJvpzGIrDKPexnJZoS1dTvSyE6DwVV3mOrPpcP9i3ZiyOXUFZgh3HP_J_b3js1P4VFeYI9SFCNPJzWRWLD1_oDcJD7KvAgHLlb2BismXa023_6ZiKZOa7qu1cvwHCEq4WS_UQnefhsXhxFQaotDQPm92nN9jBDjhIlRxom_c0t0OTrfo0TF2Gzhl4&v=404",
          imgPath:
            "https://img13.360buyimg.com/pop/s380x300_jfs/t1/182986/23/14504/65353/60f29bb7Efe095a2d/bc9c3c7e0f0fbc69.jpg.webp",
        },
        {
          path: "https://pro.jd.com/mall/active/3ezT1QLsWmuu8MPCmWEVUg46GNBA/index.html?babelChannel=ttt10",
          imgPath:
            "https://img14.360buyimg.com/babel/s380x300_jfs/t1/168591/2/9328/64891/603ddb1aE93567699/3e4e717eeac051b2.jpg.webp",
        },
        {
          path: "https://prodev.jd.com/mall/active/7aM58YGuPHf1hk427yZjcqc4oBe/index.html",
          imgPath:
            "https://img11.360buyimg.com/babel/s380x300_jfs/t1/181595/29/5122/90113/60a611c2Edbe5dcf2/38aec127b8a2a488.jpg.webp",
        },
        {
          path: "https://ccc-x.jd.com/dsp/nc?ext=aHR0cHM6Ly9tYWxsLmpkLmNvbS9pbmRleC05NTY0NzIuaHRtbA&log=Ey0wAbettlbTDUJJax4T66ICnWcSbJAyaP4NfYTkhab6Y-OQ8ZA9rSUk0DBxggOk61HkswLi2C3U-WpUBCHS6eTVmEF3cLRYo3j786KkWSC-WzRK42EPysh8sVi7KFKaUytxU7W1QUf2Jh6KBt7EAyN-3-tqQV7hStpYe-tiEpybQ1fFfTMdL8QtkEHF54dc2hIcZ_4fRvbuviJMVhk2AKoq4Ni3Y9kVbtfVNBJxiUqj0aTUymE3JjMudsB2KjTjDjjw0PoF_tednA1AqzFNTVFVK66DUN5QIXvCSOzHhUr3xdFOhmQvkpx8mVdw71x9Osd4aayMvKTmow5VSdCa5rWvYhwpUfRwuf21ApmgB6By_m4U3WtKPvVhCrGXKuF7ya1tOMwy1JBdhf0EWwnxUrj-vOBptDrWgjyufZ0b8rHbA2u5BZOxZBK1JQi-3t-pAb_hbUj6ZNZQ9LSew3ZVJwDRVRJnY3xonoTNPeCz5gVE06PZAhTuYESlexM7dfy7uCjGDHHxym4EYCA77tLe0zG8BOr4v8RqFjSlPSazE6o82u4YMtC5qZ_EVtclX8ycqddlh-W1G4L0FdVwjwarDOWNnIKdFjXeakHsfVXgGD_u1DgcSnDPtCgBKTZhPyH-BVxAZJBK5TAEggbycF7cfQ5f6EqEwUsG0B6SqgXfoAbjK5JhDh2bksU7vIpwolF_rqtr2IxxYRmtpg8EQtOoYIxd1RwRWkWGpikOvgSk7DVXv6X3GZtJvpzGIrDKPexnJZoS1dTvSyE6DwVV3mOrPpcP9i3ZiyOXUFZgh3HP_J_b3js1P4VFeYI9SFCNPJzWRWLD1_oDcJD7KvAgHLlb2BismXa023_6ZiKZOa7qu1cvwHCEq4WS_UQnefhsXhxFQaotDQPm92nN9jBDjhIlRxom_c0t0OTrfo0TF2Gzhl4&v=404",
          imgPath:
            "https://img13.360buyimg.com/pop/s380x300_jfs/t1/182986/23/14504/65353/60f29bb7Efe095a2d/bc9c3c7e0f0fbc69.jpg.webp",
        },
        {
          path: "https://pro.jd.com/mall/active/3ezT1QLsWmuu8MPCmWEVUg46GNBA/index.html?babelChannel=ttt10",
          imgPath:
            "https://img14.360buyimg.com/babel/s380x300_jfs/t1/168591/2/9328/64891/603ddb1aE93567699/3e4e717eeac051b2.jpg.webp",
        },
      ],
      newRem: [],
      newsLists: [
        {
          title: "热门",
          text: "外出上网课，小新Pad&nbsp;Pro就可以轻松搞定！",
          path: "https://kuaibao.jd.com/article?id=256651846",
        },
        {
          title: "热门",
          text: "外出上网课，小新Pad&nbsp;Pro就可以轻松搞定！",
          path: "https://kuaibao.jd.com/article?id=256651846",
        },
        {
          title: "热门",
          text: "外出上网课，小新Pad&nbsp;Pro就可以轻松搞定！",
          path: "https://kuaibao.jd.com/article?id=256651846",
        },
        {
          title: "热门",
          text: "外出上网课，小新Pad&nbsp;Pro就可以轻松搞定！",
          path: "https://kuaibao.jd.com/article?id=256651846",
        },
      ],
      helpLists: [
        {
          imgName: "icon-shouji54",
          name: "话费",
          path: "https://game.jd.com/",
          color: "#4169E1",
        },
        {
          imgName: "icon-feiji",
          name: "机票",
          path: "https://game.jd.com/",
          color: "#FFA500",
        },
        {
          imgName: "icon-jiudian",
          name: "酒店",
          path: "https://game.jd.com/",
          color: "#3CB371",
        },
        {
          imgName: "icon-youxi",
          name: "游戏",
          path: "https://game.jd.com/",
          color: "#FFA500",
        },
        {
          imgName: "icon-shuidi",
          name: "加油卡",
          path: "https://game.jd.com/",
          color: "#3CB371",
        },
        {
          imgName: "icon-huoche",
          name: "火车票",
          path: "https://game.jd.com/",
          color: "	#CD5C5C",
        },
        {
          imgName: "icon-jingdongzhongchou",
          name: "众筹",
          path: "https://game.jd.com/",
          color: "#3CB371",
        },
        {
          imgName: "icon-licai",
          name: "理财",
          path: "https://game.jd.com/",
          color: "#4169E1",
        },
        {
          imgName: "icon-baitiao",
          name: "白条",
          path: "https://game.jd.com/",
          color: "#CD5C5C",
        },
        {
          imgName: "icon-dianyingpiao",
          name: "电影票",
          path: "https://game.jd.com/",
          color: "#CD5C5C",
        },
        {
          imgName: "icon-tubiaozhizuomoban-03",
          name: "企业购",
          path: "https://game.jd.com/",
          color: "#4169E1",
        },
        {
          imgName: "icon-chushoulipinka",
          name: "礼品卡",
          path: "https://game.jd.com/",
          color: "#FFA500",
        },
      ],
      time: ["00", ":", "05", ":", "45"],
      sliderItemList: [
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
        {
          imgPath:
            "https://img13.360buyimg.com/seckillcms/s280x280_jfs/t1/191375/1/13691/65428/60f4e19cEff356f0e/a22231540f2e5d07.jpg.webp",
          path: "https://miaosha.jd.com/#100019791970",
          text: "小米11 Pro 5G 骁龙888 2K AMOLED四曲面柔性屏 67W无线闪充 3D玻璃工艺 8GB+128GB 紫色 游戏手机",
          newPrice: "4299.00",
          oldPrice: "4999.00",
        },
      ],
      newSlider: [],
      test: ["02", ":", "00", ":", "00"],
    };
  },
  created() {
    this.newRem = this.grouping(3, this.recommendLists);
    this.newSlider = this.grouping(4, this.sliderItemList);
    console.log(this.test);
  },
  methods: {
    // 处理数组数据，分组
    grouping(e, arr) {
      let newarr = [];
      for (let i = 0; i < arr.length; i += e) {
        newarr.push(arr.slice(i, i + e));
      }
      return newarr;
    },
  },
};
</script>
<style scoped>
.home {
  background-color: rgba(231, 231, 231, 0.966);
  padding-bottom: 50px;
  height: 100%;
}
.w {
  width: 1120px;
  margin: auto;
}
/* 导航栏 */
#shortcut {
  color: #999;
  border-bottom: 1px solid #ddd;
  background-color: #e3e4e5;
}
/* 头部搜索框 */
#header {
  background: #fff;
  border-bottom: 1px solid #ddd;
  height: 140px;
  position: relative;
}
/* 中间分类与推荐展示 */
#main {
  width: 1110px;
  height: 500px;
  margin: 10px auto;
  display: flex;
}
/* 秒杀界面 */
.seckill {
  height: 260px;
  display: flex;
  background: #fff;
}
.left,
.right {
  width: 200px;
  background: #fff;
  height: 480px;
}
/* 轮播图 */
.carousel {
  width: 500px;
  margin: 0 10px;
}
.carousel img {
  width: 100%;
  height: 100%;
}
/* 推荐 */
.poster {
  width: 200px;
  margin: 0 10px;
}
/* 右边用户 */
.user {
  height: 100px;
  padding: 10px 10px 0 10px;
}
.news {
  height: 120px;
}
.service {
  height: 238px;
  padding: 7px 10px;
  overflow: hidden;
}
/* 用户界面 */
.user_top {
  display: flex;
}
/* 头像 */
.avatar,
.avatar img {
  display: block;
  width: 40px;
  height: 40px;
}
.avatar {
  border: 2px solid #fff;
  border-radius: 50%;
  overflow: hidden;
}
.user_text {
  margin-left: 15px;
  color: #666;
}
.user_text p {
  height: 20px;
  line-height: 20px;
}
.user_text p span {
  margin: 0 5px;
}
.user_bom {
  margin: 10px 0;
  text-align: center;
  width: 100%;
}
.user_bom a {
  display: inline-block;
  margin: 0 5px;
  width: 70px;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  text-align: center;
  color: #fff;
  border-radius: 13px;
  background: #e1251b;
}
.user_bom a:nth-child(2) {
  background: #363634;
  color: #e5d790;
}
.user_bom a:hover {
  color: #fff;
  background: #c81623;
}
.user_bom::after {
  content: "";
  position: relative;
  display: block;
  top: 5px;
  left: 12px;
  width: 150px;
  height: 1px;
  border-bottom: 0.1px solid #ccc;
}
/* 新闻界面 */
.news_hd {
  height: 30px;
}
.news_list {
  height: 88px;
}
.hd1 {
  float: left;
  color: #c81623;
  font-weight: bolder;
  font-size: 16px;
  padding-left: 15px;
  line-height: 30px;
}
.hd2 {
  float: right;
  color: #666;
  font-size: 13px;
  line-height: 30px;
  padding-right: 15px;
}
.news_list::after {
  content: "";
  position: relative;
  display: block;
  top: 2px;
  left: 22px;
  width: 150px;
  height: 1px;
  border-bottom: 0.1px solid #ccc;
}
/* 帮助界面 */
.service ul {
  height: 100%;
  overflow: hidden;
}
.serveItem {
  width: 58px;
  height: 56px;
  text-align: center;
  display: inline-block;
}
.serveItem i,
.serveItem span {
  display: block;
}
.serveItem i {
  font-size: 20px;
}
.serveItem:hover {
  color: #c81623;
  background: rgb(228, 228, 228);
}
/* 秒杀界面 */
.time,
.band {
  width: 220px;
  height: 100%;
}
.items {
  width: 670px;
}
/* 倒计时 */
.time {
  color: #fff;
  background-color: #e83632;
  background-image: url(https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/assets/img/4a15d8883775742e3efbb850ae14def7.png);
  background-size: cover;
  background-repeat: no-repeat;
  text-align: center;
}
.time header {
  width: 100%;
  font-size: 30px;
  font-weight: 700;
  margin-top: 31px;
}
.countdown {
  margin-top: 100px;
  height: 85px;
}
.countdown p {
  font-size: 15px;
  margin-bottom: 10px;
}
.countdown p strong {
  font-weight: bolder;
  font-size: 18px;
}
.down span {
  font-size: 20px;
  font-weight: bolder;
  margin: 5px;
}
.down span:nth-child(2n + 1) {
  padding: 5px;
  background: #000;
}
/* 轮播图 */
.el-carousel {
  overflow: hidden;
}
.itemsA {
  display: inline-block;
  width: 167.5px;
  height: 100%;
  text-align: center;
}
.itemsA:hover {
  color: #c81623;
}
.itemsA img {
  border-right: 1px solid rgb(216, 216, 216);
  width: 136.5px;
  height: 150px;
  margin: 15px;
}
.itemsTitle {
  font-weight: 400;
  color: #333;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-left: auto;
  margin-right: auto;
  margin-top: 13px;
  width: 125px;
  display: block;
}
/* 秒杀品牌 */
.container {
  display: block;
  height: 240px;
  padding: 10px 10px 0 10px;
  margin-bottom: 10px;
  text-align: center;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.5),
    rgba(220, 224, 236, 0.5)
  );
}
.container img {
  width: 120px;
  height: 120px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}
.container span {
  display: block;
  color: #666;
  font-size: 16px;
}
.container span:nth-child(2n-1) {
  color: #000;
  font-weight: 700;
}
.btn {
  display: inline-block;
  padding: 4px 10px;
  margin-top: 10px;
  border-radius: 20px;
  border: 1px solid #e1251b;
  color: #e1251b;
}
.btn:hover {
  background: #e1251b;
  color: #fff;
}
</style>
